<ui:composition template="../principal.xhtml"
                xmlns="http://www.w3.org/1999/xhtml"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:p="http://primefaces.org/ui"
                xmlns:c="http://java.sun.com/jsp/jstl/core">
    <ui:define name="principal">
        <h2>Gerenciar Serviços</h2>

        <h:form id="breadcrumb">
            <p:breadCrumb styleClass="navegacao" style="margin-top: 5px; margin-bottom: 40px">  
                <c:if test="#{loginMB.dentista.contaUsuario.tipo == 'AD'}" >  
                    <p:menuitem value="Categories" url="../user-master/menuMaster.xhtml" />  
                </c:if>
                <c:if test="#{loginMB.dentista.contaUsuario.tipo == 'DE'}" >  
                    <p:menuitem value="Categories" url="../user-simple/menuDentista.xhtml" />  
                </c:if>
                <p:menuitem value="Clínica" url="../clinica/adminClinica.xhtml" />  
                <p:menuitem value="Gerenciar Serviços" url="gerenciarServicos.xhtml" />
            </p:breadCrumb>
        </h:form>

        <h:form id="cad">
            <p:growl id="message"/>
            <p:fieldset legend="NOVO SERVIÇO" toggleable="true" toggleSpeed="500" styleClass="grupo-form">
                <h:panelGrid columns="2" styleClass="table-form" cellspacing="10">
                    <h:outputLabel for="nome" value="*Nome: " />  
                    <p:inputText id="nome" title="nome" value="#{gerenciarServicosMB.servico.nome}" required="true" label="Nome" size="50" />
                    <h:outputLabel for="descricao" value="*Descrição: " />  
                    <p:inputTextarea id="descricao" title="descricao" value="#{gerenciarServicosMB.servico.descricao}" required="true" label="Descrição" cols="50" autoResize="true" />
                    <h:outputLabel for="valor1" value="*Valor 1: " />
                    <p:inputText id="valor1" title="valor1" value="#{gerenciarServicosMB.servico.valor1}" required="true" label="Valor 1" size="20" >
                        <f:convertNumber pattern="#,##0.00"></f:convertNumber>  
                        <f:validator validatorId="MoedaValidator"  />
                    </p:inputText>
                    <h:outputLabel for="valor2" value="*Valor 2: " />
                    <p:inputText id="valor2" title="valor2" value="#{gerenciarServicosMB.servico.valor2}" required="true" label="Valor 2" size="20" >
                        <f:convertNumber pattern="#,##0.00"></f:convertNumber>  
                        <f:validator validatorId="MoedaValidator"  />
                    </p:inputText>
                    <h:outputLabel for="valor3" value="*Valor 3: " />
                    <p:inputText id="valor3" title="valor3" value="#{gerenciarServicosMB.servico.valor3}" required="true" label="Valor 3" size="20" >
                        <f:convertNumber pattern="#,##0.00"></f:convertNumber>  
                        <f:validator validatorId="MoedaValidator"  />
                    </p:inputText>

                </h:panelGrid>
            </p:fieldset>
            <h:panelGrid columns="1" style="text-align: right; width: 100%;">
                <p:commandButton id="salvar" value="Salvar" update=":cad, :dados" action="#{gerenciarServicosMB.salvarServico()}" image="ui-icon ui-icon-disk" style="font-size: 15px;" />
            </h:panelGrid>
        </h:form>

        <p:separator style="margin-top: 20px; margin-bottom: 20px;"/>

        <h:form id="dados">
            <p:dataTable id="table-servicos" value="#{gerenciarServicosMB.servicosTodos}" widgetVar="servicoTable" var="servico" tableStyle="width:100%" paginator="true" rows="10"  
                         paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"  
                         rowsPerPageTemplate="10,15,20,30" paginatorPosition="bottom" paginatorAlwaysVisible="false" emptyMessage="Sem serviços cadastrados.">

                <f:facet name="header">  
                    SERVIÇOS CADASTRADOS
                </f:facet>

                <p:column headerText="ID" sortBy="#{servico.id}" filterMatchMode="contains" filterBy="#{servico.id}" filterStyle="display:none;">  
                    <h:outputText value="#{servico.id}" />  
                </p:column>

                <p:column headerText="NOME" sortBy="#{servico.nome}" filterMatchMode="contains" filterBy="#{servico.nome}" filterStyle="display:none;">  
                    <h:outputText value="#{servico.nome}" />  
                </p:column>

                <p:column headerText="VALOR1" sortBy="#{servico.valor1}" filterMatchMode="contains" filterBy="#{servico.valor1}" filterStyle="display:none;">  
                    <h:outputText value="#{servico.valor1}" >
                        <f:convertNumber pattern="#,##0.00"/>
                    </h:outputText>  
                </p:column>

                <p:column style="width:40px">  
                    <p:commandButton id="selectButton" update=":dados:display" oncomplete="servicoDialog.show()" icon="ui-icon-search" title="Ver">  
                        <f:setPropertyActionListener value="#{servico}" target="#{gerenciarServicosMB.servicoSelecionado}" />
                    </p:commandButton>  
                </p:column>

                <f:facet name="footer">  
                    <p:outputPanel style="float: right">  
                        <h:outputText value="BUSCAR: " />  
                        <p:inputText id="globalFilter" onblur="servicoTable.filter()" style="width:200px" />  
                    </p:outputPanel> 
                </f:facet>

            </p:dataTable>

            <p:blockUI block="table-servicos" trigger="table-servicos, :cad:salvar">  
                Carregando...<br />  
                <p:graphicImage library="images" name="loader.gif"/>  
            </p:blockUI>

            <p:dialog header="Detalhes do Serviço" widgetVar="servicoDialog" resizable="false" id="servicoDlg" dynamic="true" 
                      showEffect="fade" hideEffect="fade" modal="true">
                <h:panelGrid id="display" columns="1" width="400"> 

                    <h:panelGrid columns="2" cellspacing="10">
                        <h:outputText value="NOME: " styleClass="rotulo" />
                        <h:outputText value="#{gerenciarServicosMB.servicoSelecionado.nome}" style="font-weight:bold"/>

                        <h:outputText value="VALOR 1: " styleClass="rotulo" />
                        <h:outputText value="#{gerenciarServicosMB.servicoSelecionado.valor1}" style="font-weight:bold" >
                            <f:convertNumber pattern="#,##0.00"/>
                        </h:outputText>

                        <h:outputText value="VALOR 2:" styleClass="rotulo" />
                        <h:outputText value="#{gerenciarServicosMB.servicoSelecionado.valor2}" style="font-weight:bold" >
                            <f:convertNumber pattern="#,##0.00"/>
                        </h:outputText>

                        <h:outputText value="VALOR 3:" styleClass="rotulo" />
                        <h:outputText value="#{gerenciarServicosMB.servicoSelecionado.valor3}" style="font-weight:bold" >
                            <f:convertNumber pattern="#,##0.00"/>
                        </h:outputText>
                    </h:panelGrid>
                    
                    <h:panelGrid columns="1" cellspacing="10">
                        <h:outputText value="DESCRIÇÃO: "/>
                        <h:outputText value="#{gerenciarServicosMB.servicoSelecionado.descricao}" style="font-weight:bold"/>
                    </h:panelGrid>

                </h:panelGrid>
                <h:panelGrid columns="2" style="float: right">
                    <p:commandButton value="Excluir" onclick="confirmation.show()" icon="ui-icon-trash" type="button" />
                    <p:commandButton value="Atualizar" update=":cad" action="#{gerenciarServicosMB.atualizarServico()}" icon="ui-icon-refresh" oncomplete="servicoDialog.hide();" />
                </h:panelGrid>
            </p:dialog>

            <p:confirmDialog id="confirmDialog" message="Tem certeza que deseja excluir o Serviço?" header="Excluir Serviço" severity="alert" widgetVar="confirmation">  
                <p:commandButton id="confirm" value="Confirmar" update=":dados, :cad" oncomplete="confirmation.hide()" action="#{gerenciarServicosMB.excluirServico()}" />  
                <p:commandButton id="decline" value="Cancelar" onclick="confirmation.hide()" type="button" />   
            </p:confirmDialog>
        </h:form>
    </ui:define>
</ui:composition>